<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8"/>
    <title>公告管理</title>
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
    <META HTTP-EQUIV="Expires" CONTENT="0">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" th:href="@{/static/css/bootstrap.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/static/css/font-awesome.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/static/css/theme.css}"/>
    <link rel="stylesheet" th:href="@{/static/css/index.css}"/>
    <script th:src="@{/static/js/jquery.min.js}" type="text/javascript"></script>
    <script type="text/javascript" th:src="@{/static/js/bootstrap.js}"></script>
    <script th:src="@{/static/js/app.js}" type="text/javascript" charset="utf-8"></script>
</head>

<body>

<body>
<section class="body">

    <!-- start: header -->
    <header class="header">
        <div class="logo-container">
            <a href="" class="logo">
                <h1>管理员后台</h1>
            </a>
            <div class="visible-xs toggle-sidebar-left">
                <i class="fa fa-bars"></i>
            </div>
        </div>

        <!-- start: user box -->
        <div class="header-right">

            <span class="separator"></span>

            <div id="userbox" class="userbox">
                <a href="#" data-toggle="dropdown">
                    <figure class="profile-picture">
                        <img th:src="@{/static/imgs/avator.png}" alt="名字" class="img-circle"/>
                    </figure>
                    <div class="profile-info">
                        <span class="name">张三</span>
                        <span class="role">超级管理员</span>
                    </div>

                    <i class="fa custom-caret"></i>
                </a>

                <div class="dropdown-menu">
                    <ul class="list-unstyled">
                        <li class="divider"></li>
                        <li>
                            <a role="menuitem" href="#"><i class="fa fa-user"></i>个人中心</a>
                        </li>
                        <li>
                            <a role="menuitem" href="#"><i class="fa fa-gear"></i>系统设置</a>
                        </li>
                        <li>
                            <a role="menuitem" href="/admin/outLogin"><i class="fa fa-sign-out"></i>退出登录</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

    </header>
    <!-- end: header -->

    <div class="inner-wrapper">
        <!-- start: sidebar -->
        <aside id="sidebar-left" class="sidebar-left">

            <div class="nano">
                <div class="nano-content">
                    <nav id="menu" class="nav-main" role="navigation">
                        <ul class="nav nav-main">
                            <li class="nav-active">
                                <a href="/admin/">
                                    <i class="fa fa-home" aria-hidden="true"></i>
                                    <span>首页</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/getUsers?current=1">
                                    <i class="fa fa-users" aria-hidden="true"></i>
                                    <span>会员管理</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/recharge?current=1">
                                    <i class="fa fa-credit-card" aria-hidden="true"></i>
                                    <span>充币管理</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/withdraw?current=1">
                                    <i class="fa fa-usd" aria-hidden="true"></i>
                                    <span>提币管理</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/goods?current=1">
                                    <i class="fa fa-shopping-cart" aria-hidden="true"></i>
                                    <span>商品管理</span>
                                </a>
                            </li>
<!--                            <li class="nav-active">-->
<!--                                <a href="/admin/vipSetting">-->
<!--                                    <i class="fa fa-trophy" aria-hidden="true"></i>-->
<!--                                    <span>VIP管理</span>-->
<!--                                </a>-->
<!--                            </li>-->
                            <li class="nav-active">
                                <a href="/admin/taskArea">
                                    <i class="fa fa-tasks" aria-hidden="true"></i>
                                    <span>理财等级抢单收益管理</span>
                                </a>
                            </li>
<!--                            <li class="nav-active">-->
<!--                                <a href="/admin/bonus">-->
<!--                                    <i class="fa fa-cny" aria-hidden="true"></i>-->
<!--                                    <span>理财收益比例管理</span>-->
<!--                                </a>-->
<!--                            </li>-->
                            <li class="nav-active">
                                <a href="/admin/product">
                                    <i class="fa fa-bookmark" aria-hidden="true"></i>
                                    <span>理财收益比例管理</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/ann?current=1">
                                    <i class="fa fa-comment" aria-hidden="true"></i>
                                    <span>公告管理</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/carousel">
                                    <i class="fa fa-th-list" aria-hidden="true"></i>
                                    <span>轮播图管理</span>
                                </a>
                            </li>
<!--                            <li class="nav-active">-->
<!--                                <a href="/admin/pay">-->
<!--                                    <i class="fa fa-btc" aria-hidden="true"></i>-->
<!--                                    <span>收款方式管理</span>-->
<!--                                </a>-->
<!--                            </li>-->
                            <li class="nav-active">
                                <a href="/admin/time">
                                    <i class="fa fa-clock-o" aria-hidden="true"></i>
                                    <span>抢单时段管理</span>
                                </a>
                            </li>
                            <li class="nav-active">
                                <a href="/admin/app">
                                    <i class="fa fa-arrow-down" aria-hidden="true"></i>
                                    <span>APP管理</span>
                                </a>
                            </li>
                        </ul>
                    </nav>

                </div>

            </div>

        </aside>
        <!-- end: sidebar -->

        <section role="main" class="content-body">
            <header class="page-header">
                <h2>公告管理</h2>
                <div class="right-wrapper pull-right">
                    <ol class="breadcrumbs">
                        <li>
                            <a href="/admin/">
                                <i class="fa fa-home"></i>
                            </a>
                        </li>
                        <li><span>公告管理</span></li>
                    </ol>
                </div>
                <div id="userbox2" class="userbox pull-right">
                    <a href="#" data-toggle="dropdown">
                        <figure class="profile-picture">
                            <img th:src="@{/static/imgs/avator.png}" alt="名字" class="img-circle">
                        </figure>
                        <div class="profile-info">
                            <span class="name">张三</span>
                            <span class="role">超级管理员</span>
                        </div>

                        <i class="fa custom-caret"></i>
                    </a>

                    <div class="dropdown-menu">
                        <ul class="list-unstyled">
                            <li class="divider"></li>
                            <li>
                                <a role="menuitem" href="#"><i class="fa fa-user"></i>个人中心</a>
                            </li>
                            <li>
                                <a role="menuitem" href="#"><i class="fa fa-user"></i>系统设置</a>
                            </li>
                            <li>
                                <a role="menuitem" href="/admin/outLogin"><i class="fa fa-user"></i>退出登录</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </header>

            <!-- start: page -->
            <section class="panel">

                <div class="panel-body">
                    <div class="dataTables_wrapper">
                        <div class="table-filter">
                            <form class="form-inline" action="/admin/ann" method="get">
                                <input type="hidden" name="current" value="1">
                                <div class="form-group">
                                    <label>标题</label>
                                    <input type="text" class="form-control" placeholder="标题" name="title"
                                           autocomplete="off" th:value="${title}" id="title">
                                </div>
                                <div class="form-group">
                                    <label>开始时间</label>
                                    <input type="text" class="form-control" placeholder="开始时间" id="datetimeStart"
                                           name="start" autocomplete="off" th:value="${start}">
                                </div>

                                <div class="form-group">
                                    <label>结束时间</label>
                                    <input type="text" class="form-control" placeholder="结束时间" id="datetimeEnd"
                                           name="end" autocomplete="off" th:value="${end}">
                                </div>
                                <div class="form-group">
                                    <label>筛选</label>
                                    <select id="type" class="form-control" th:value="${type}" name="type">
                                        <option value="" th:selected="${type}==''">全部</option>
                                        <option value="0" th:selected="${type}=='0'">未下架</option>
                                        <option value="1" th:selected="${type}=='1'">已下架</option>
                                    </select>
                                </div>
                                <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i>搜索</button>
                                <button type="button" class="btn btn-default" onclick="reset1()"
                                        style="margin-left: 30px"><i class="fa fa-trash-o"></i>清空
                                </button>
                            </form>
                            <div class="col-lg-11"></div>
                            <button type="button" class="btn btn-success" data-toggle="modal" data-target="#modalPlus"
                                    href="javascript:;" style="width: 106px;margin-left: 17px"><i
                                    class="fa fa-plus"></i>新增
                            </button>
                        </div>
                        <div class="table-responsive">
                            <table class="table table-bordered table-striped mb-none dataTable table-hover">
                                <thead>
                                <tr>
                                    <th>标题</th>
                                    <th>内容</th>
                                    <th>状态</th>
                                    <th>时间</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr th:each="record:${list}">
                                    <td th:text="${record.title}"></td>
                                    <td th:text="${record.content}"></td>
                                    <td th:if="${record.state}==0">
                                         <span style="padding:5px 10px; border-radius: 5px; background-color: green;color: #FFF;">
                                            未下架
                                        </span>
                                    </td>
                                    <td th:if="${record.state}==1">
                                         <span style="padding:5px 10px; border-radius: 5px; background-color: red;color: #FFF;">
                                            已下架
                                        </span>
                                    </td>
                                    <td th:text="${record.createDate}"></td>
                                    <td>
                                        <a class="mb-xs mt-xs mr-xs modal-basic btn btn-warning" data-toggle="modal"
                                           data-target="#modalWarning" href="javascript:;" th:if="${record.state}==0"
                                           th:onclick="edit([[${record.id}]],[[${record.title}]],[[${record.content}]])">编辑</a>
                                        <a class="mb-xs mt-xs mr-xs modal-basic btn btn-danger" data-toggle="modal"
                                           data-target="#modalDanger" href="javascript:;" th:if="${record.state}==0"
                                           th:onclick="OffShelf([[${record.id}]])">下架</a>
                                        <span th:if="${record.state}==1">无操作</span>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                        <div class="row datatables-footer">
                            <div class="col-sm-12 col-md-6">
                                <div class="dataTables_info"
                                     th:text="'当前'+${current}+'页,共'+${totalPages}+'页,共'+${totalCount}+'条'">当前
                                    1页，共0页，共0条数据
                                </div>
                            </div>
                            <div class="col-sm-12 col-md-6 text-right">
                                <div class="dataTables_paginate paging_bs_normal">
                                    <ul class="pagination">
                                        <input type="hidden" th:value="${totalPages}" id="totalPages">
                                        <input type="hidden" th:value="${current}" id="current">
                                        <li th:class="${current}==1?'prev disabled':'prev'">
                                            <a th:href="${current}==1?
                                            @{/admin/ann(current=${current},title=${title},start=${start},end=${end},type=${type})}
                                            :@{/admin/ann(current=(${current}-1),title=${title},start=${start},end=${end},type=${type})}">
                                                <span class="fa fa-chevron-left"></span>
                                            </a>
                                        </li>
                                        <li th:class="${current}==${totalPages}?'next disabled':'next'">
                                            <a th:href="${current}==${totalPages}?
                                            @{/admin/ann(current=${totalPages},title=${title},start=${start},end=${end},type=${type})}
                                            :@{/admin/ann(current=(${current}+1),title=${title},start=${start},end=${end},type=${type})}">
                                                <span class="fa fa-chevron-right"></span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </section>
    </div>

</section>

<!--日历-->
<link rel="stylesheet" type="text/css" th:href="@{/static/css/bootstrap-datetimepicker.css}"/>
<script th:src="@{/static/js/bootstrap-datetimepicker.js}" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" th:src="@{/static/layer/layer.js}"></script>
<script type="text/javascript">
    $("#datetimeStart").datetimepicker({

        format: 'yyyy-mm-dd hh:ii',

        // minView: 'month',

        language: 'zh-CN',

        autoclose: true

        // startDate: new Date()

    }).on("click", function () {

        $("#datetimeStart").datetimepicker("setEndDate", $("#datetimeEnd").val())

    });

    $("#datetimeEnd").datetimepicker({

        format: 'yyyy-mm-dd hh:ii',

        // minView: 'month',

        language: 'zh-CN',

        autoclose: true

        // startDate: new Date()

    }).on("click", function () {

        $("#datetimeEnd").datetimepicker("setStartDate", $("#datetimeStart").val())
    });

    function reset1() {
        $("#title").val("");
        $("#datetimeStart").val("");
        $("#datetimeEnd").val("");
        $("#type").val("");
    }

    var annId;

    function OffShelf(id) {
        annId = id;
    }

    function dan() {
        $.ajax({
            type: 'POST',
            url: '/admin/offShelf',
            dataType: 'json',
            data: {
                id: annId
            },
            success: function (res) {
                if (res.code == 200) {
                    layer.msg('成功', {icon: 6});
                    window.location.replace("/admin/ann?current=1");
                } else {
                    layer.msg(res.message, {icon: 5});
                }
            }
        });
    }


    function edit(id, title, content) {
        $("#edit_id").val(id);
        $("#edit_title").val(title);
        $("#edit_content").val(content);
    }

    function edit_sub() {
        var id = $("#edit_id").val();
        var title = $("#edit_title").val();
        var content = $("#edit_content").val();
        if (title == '' || content == '') {
            layer.msg("所填字段不能为空");
            return false;
        }
        $.ajax({
            type: 'POST',
            url: '/admin/editAnn',
            dataType: 'json',
            data: {
                id: id,
                title: title,
                content: content
            },
            success: function (res) {
                if (res.code == 200) {
                    layer.msg('成功', {icon: 6});
                    window.location.replace("/admin/ann?current=1");
                } else {
                    layer.msg(res.method, {icon: 5});
                }
            }
        });
    }

    function add_sub() {
        var title = $("#add_title").val();
        var content = $("#add_content").val();
        if (title == '' || content == '') {
            layer.msg("所填字段不能为空");
            return false;
        }

        $.ajax({
            type: 'POST',
            url: '/admin/addAnn',
            dataType: 'json',
            data: {
                title: title,
                content: content
            },
            success: function (res) {
                if (res.code == 200) {
                    layer.msg('成功', {icon: 6});
                    window.location.replace("/admin/ann?current=1");
                } else {
                    layer.msg(res.method, {icon: 5});
                }
            }
        });
    }


</script>

<!--弹出框-->
<div id="modalWarning" class="modal-box modal-block-warning modal fade" tabindex="-1" role="dialog" aria-labelledby="">
    <section class="panel">
        <header class="panel-heading">
            <h2 class="panel-title">编辑</h2>
        </header>
        <div class="panel-body">
            <div class="modal-wrapper">
                <div class="form-horizontal">
                    <input type="hidden" id="edit_id">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">标题</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="edit_title">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">内容</label>
                        <div class="col-sm-8">
                            <textarea type="number" class="form-control" id="edit_content"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <footer class="panel-footer">
            <div class="row">
                <div class="col-md-12 text-right">
                    <button class="btn btn-primary modal-confirm" type="button" onclick="edit_sub()">提交</button>
                    <button class="btn btn-default modal-dismiss" data-dismiss="modal">取消</button>
                </div>
            </div>
        </footer>
    </section>
</div>

<div id="modalPlus" class="modal-box modal-block-warning modal fade" tabindex="-1" role="dialog" aria-labelledby="">
    <section class="panel">
        <header class="panel-heading">
            <h2 class="panel-title">新增</h2>
        </header>
        <div class="panel-body">
            <div class="modal-wrapper">
                <div class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">标题</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="add_title">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">内容</label>
                        <div class="col-sm-8">
                            <textarea type="text" class="form-control" id="add_content"></textarea>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <footer class="panel-footer">
            <div class="row">
                <div class="col-md-12 text-right">
                    <button class="btn btn-primary modal-confirm" type="button" onclick="add_sub()">提交</button>
                    <button class="btn btn-default modal-dismiss" data-dismiss="modal">取消</button>
                </div>
            </div>
        </footer>
    </section>
</div>


<div id="modalSuccess" class="modal-box modal-block-success modal fade" tabindex="-1" role="dialog" aria-labelledby="">
    <section class="panel">
        <header class="panel-heading">
            <h2 class="panel-title">友情提示</h2>
        </header>
        <div class="panel-body">
            <div class="modal-wrapper">
                <div class="modal-icon">
                    <i class="fa fa-check"></i>
                </div>
                <div class="modal-text">
                    <h4>操作提示</h4>
                    <p>确定要进行此操作吗？</p>
                </div>
            </div>
        </div>
        <footer class="panel-footer">
            <div class="row">
                <div class="col-md-12 text-right">
                    <button class="btn btn-primary modal-confirm" onclick="suc()">确定</button>
                    <button class="btn btn-default modal-dismiss" data-dismiss="modal">取消</button>
                </div>
            </div>
        </footer>
    </section>
</div>

<div id="modalDanger" class="modal-box modal-block-danger modal fade" tabindex="-1" role="dialog" aria-labelledby="">
    <section class="panel">
        <header class="panel-heading">
            <h2 class="panel-title">友情提示</h2>
        </header>
        <div class="panel-body">
            <div class="modal-wrapper">
                <div class="modal-icon">
                    <i class="fa fa-times-circle"></i>
                </div>
                <div class="modal-text">
                    <h4>操作提示</h4>
                    <p>确定要进行此操作吗？</p>
                </div>
            </div>
        </div>
        <footer class="panel-footer">
            <div class="row">
                <div class="col-md-12 text-right">
                    <button class="btn btn-primary modal-confirm" onclick="dan()">确定</button>
                    <button class="btn btn-default modal-dismiss" data-dismiss="modal">取消</button>
                </div>
            </div>
        </footer>
    </section>
</div>
</body>

</body>

</html>